<template>
	<view>
		<view v-for="(item,index) in truck_list" :key="item.transferid" class="truck_item"
			@click="onScanLoad(item,'1')">
			<view class="div_item">
				<view>发往<span>{{item.addrto || '--'}}</span></view>
				<view>卸货点<span>{{item.addrxhd || '--'}}</span></view>
			</view>
			<view class="div_item">
				<view>车牌号<span>{{item.vehicleNo || '--'}}</span></view>
				<view>装车单号<span>{{item.loadNo || '--'}}</span></view>
			</view>
			<view class="div_item">
				<view>驾驶员<span>{{item.driver || '--'}}</span></view>
				<view>电话<span>{{item.driverTel || '--'}}</span></view>
			</view>
			<view class="div_item">
				<view>运单数<span>{{item.waybill.length}}</span></view>
				<!-- <view>电话<span>--</span></view> -->
			</view>

			<!-- 底部操作菜单 -->
			<view class="op_menu_div">
				<view class="btn_share" @click.stop="onContract(item)">上传协议</view>
			</view>

		</view>

		<view v-if="!truck_list || truck_list.length <= 0"
			style="width: 100vw;height: 80vh;text-align: center;margin: 38vh 0 0 0;">
			暂无数据~
		</view>

	</view>
</template>

<script>
	import { tsToDateAndTime, tsToDateFormat } from '@/utils/util.js'
	export default {
		data() {
			return {
				truck_list: [], // 车次列表
				curr_truck: {}, // 记录当前操作的车次
			}
		},

		methods: {

			onScanLoad(item, type) {
				// this.$toast('暂不支持查看详情')
				let url = '/pages/i2/agreement/train_detail/train_detail'
				uni.navigateTo({ url: `${url}?truck=${JSON.stringify(item)}&type=${type}` })
			},

			onContract(item) {
				let that = this
				this.curr_truck = item

				uni.chooseImage({
					success: (chooseImageRes) => {
						const tempFilePaths = chooseImageRes.tempFilePaths
						uni.uploadFile({
							url: 'https://vms.shunhewulian.com/api/common/upload',
							filePath: tempFilePaths[0],
							name: 'file',
							formData: { 'upload': 'uploadFormData' },
							complete: uploadFileRes => {
								console.log(uploadFileRes);
								let { code, msg, data } = JSON.parse(uploadFileRes.data)
								if (code == 1 && data && data.fullurl) {
									// console.log('上传.id= ', item.transferid);
									// console.log('上传.agreement_img= ', data.fullurl);
									that.uploadAgreement(item.id, data.fullurl)
								}
							},

						});
					}
				});

			},

			async getTruckList() {
				let uinfo = this.$getUserInfo()
				// memberid: '200017',
				// accountid: '7789925a89204c38a0c1f9e73cbdc293',
				let res = await this.$train_list({
					token: uinfo.token,
					var_page: 1,
					list_rows: 99999999
				})
				console.log('getTruckList.res =', res);
				this.truck_list = res.data
				// this.truck_list = this.truck_list.reverse()
			},

			// 接口:上传协议
			async uploadAgreement(id, agreement_img) {
				let res = await this.$uploadAgreement({ id, agreement_img })
				if (res.code == 1) {
					this.$toast('上传成功')
					this.getTruckList() // 上传协议成功 刷新数据
				} else {
					// this.$toast(res.msg || '数据异常')
					uni.showModal({
						title: '提示',
						content: res.msg || '数据异常',
						showCancel: false
					})
				}
			},

		},

		mounted() {
			let that = this
			this.getTruckList()

			// 事件总线:创建车次成功
			uni.$on('onCreateTruck', data => {
				that.getTruckList()
			})

		},

		onPullDownRefresh() {
			console.log('车次列表出发下拉刷新...');
			this.getTruckList()
			setTimeout(() => {
				uni.stopPullDownRefresh()
			}, 3000)
		},

	}
</script>

<style scoped>
	.truck_item {
		margin: 20rpx;
		border: solid 1rpx rgba(0, 0, 0, 0.15);
		border-radius: 10rpx;
	}

	.div_item {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin: 14rpx 14rpx 0 14rpx;
		font-size: 28rpx;
	}

	span {
		/* display: block; */
		margin: 0 0 0 10rpx;
		color: #1890FF;
		font-size: 26rpx;
	}

	.op_menu_div {
		display: flex;
		justify-content: flex-end;
		padding: 14rpx;
	}

	.btn_share {
		background-color: #1890FF;
		width: 118rpx;
		height: 52rpx;
		line-height: 52rpx;
		text-align: center;
		font-size: 24rpx;
		color: white;
		border-radius: 4rpx;
		margin: 0 0 0 12rpx;
	}
</style>